feat(extensions): progress UI + error display during install by yasinBursali · Pull Request #828 · Light-Heart-Labs/DreamServer

yasinBursali · 2026-04-06T14:15:30Z

What

Show real-time install progress in the Extensions portal with status badges for all lifecycle states.

Why

Users see only a spinner during extension install — no indication of what's happening. If Docker pulls a large image for 5 minutes, there's no progress feedback. If it fails, the error is generic. The frontend also times out at 2 minutes while the backend allows 5 — causing false "failed" messages on slow connections.

How

Progress polling: During install/enable, polls GET /api/extensions/{service_id}/progress every 3s. Shows phase labels ("Downloading image...", "Starting container...") in the extension card.
useRef mirror: installProgressRef avoids stale closure bug — the polling interval updates both ref and state, catch block reads from ref.
Status badges: installing/setting_up show blue badge with spinner. error shows red clickable badge that opens console/log viewer.
Error detail in toast: When install fails and progress has error data, appends Docker stderr to the toast message.
Timeout fix: AbortSignal.timeout changed from 120000ms to 300000ms — matches backend _AGENT_TIMEOUT.

Security

Progress data (phase_label, error) rendered as text content, not dangerouslySetInnerHTML — no XSS risk
Auth handled by nginx proxy (existing pattern) — no credentials in frontend code
Error detail truncated to 500 chars at the source (host agent)

Test Coverage

No automated frontend tests (React testing not configured in project). Manual test checklist:

Install extension → card shows progress phases (Downloading → Starting → enabled)
Install fails → error badge appears, toast shows Docker stderr detail
Click error badge → opens console/log viewer
"Installing" filter shows only installing extensions
"Setting Up" filter shows only setting-up extensions
"Error" filter shows only errored extensions
Summary bar shows Installing and Error counters
Install takes >2 min → no frontend timeout (was broken at 120s, now 300s)
setting_up status shows blue badge with "setting up" label + spinner

Three Pillars Impact

Install Reliability: Improved — users see what's happening, errors are actionable
Broad Compatibility: No new dependencies, no platform-specific code, pure React/JSX
Extension Coherence: No impact on dream enable/disable or extension system

Files Changed

File	Changes
`extensions/services/dashboard/src/pages/Extensions.jsx`	+61/-5 — progress polling, status badges, error display, timeout fix

Platform Impact

All platforms: Pure frontend change — no platform-specific behavior

Sequence

PR 3 of 3 — Extension Lifecycle States

PR 1: Fix user extension status (fix(extensions): health-based status for user extensions + restart for stopped services #825) — must merge first
PR 2: Install progress tracking (feat(extensions): install progress tracking with host agent orchestration #827) — must merge second
PR 3: Frontend progress UI (this PR)

Note: This PR is stacked on #827 which is stacked on #825. Merge in order: #825 → #827 → this PR.

🤖 Generated with Claude Code

Lightheartdevs

Audit: REQUEST CHANGES — CI failing + depends on #827 + merge conflict

Good frontend work — progress polling every 3s, phase labels, useRef mirror to avoid stale closures, error badges with click-to-console. The UX design is well thought out.

Blockers:

CI failing: Same Ruff lint + api test failures as #827.
Depends on #827: Needs the progress endpoint to exist before this frontend can poll it.
Merge conflict: Same Extensions.jsx conflict as #825 and #827. All new UI elements must use theme variables (see mapping in #825 comment).
Check for hardcoded colors: Any new badges, spinners, or status text added in this PR should use text-theme-accent / bg-theme-accent/20 / text-theme-text-muted instead of text-indigo-* / bg-zinc-*. The page was just migrated to the liquid metal design system in #829.

Merge order: #825 → #827 → #828

Once #825 is rebased and merged, the whole chain can follow. The backend design in #827 is solid — just needs CI fixes and the rebase.

…r stopped services User extensions now get real health checking instead of file-based status. "stopped" status (red badge) replaces the misleading "enabled" for crashed containers. Start button allows restarting stopped extensions without the disable-enable workaround. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

- Remove unused os and MagicMock imports (ruff F401) - Use float('-inf') as cache timestamp sentinel instead of 0.0 to prevent false cache hits on fresh CI VMs where time.monotonic() may be smaller than the TTL value Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

The file was added in the health-based status PR but missing from the Dockerfile's explicit COPY list, causing ModuleNotFoundError at runtime inside the container. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

…tion Host agent writes stage-by-stage progress files during extension install (setup_hook → pulling → starting → done/error). Dashboard-API serves progress via polling endpoint and reflects install status in catalog. Replaces two-call install pattern with single 202+background-thread endpoint. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

Show real-time install progress in the Extensions portal — polling progress endpoint every 3s during install to display phase labels (downloading, starting). Add status badges for installing, setting_up, and error states. Fix frontend timeout from 120s to 300s to match backend. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

yasinBursali · 2026-04-06T17:38:49Z

Rebased onto the updated #827 branch (post-liquid metal). All review feedback addressed:

Merge conflicts resolved — 3 conflicts in Extensions.jsx, all resolved using theme variables:

Summary bar: "Available" uses bg-theme-accent (not bg-indigo-500), new "Installing" and "Error" items use semantic blue/red
Icon container fallback: bg-theme-card (not bg-zinc-800)
Icon text fallback: text-theme-text-muted (not text-zinc-400)

Hardcoded color audit:

Progress indicator border: border-zinc-800/60 → border-theme-border/60 (matches card footer pattern on line 497)
All new badges/spinners use semantic status colors (blue for installing/setting_up, red for error) — kept as-is per guidance
Zero remaining zinc/indigo references in the diff

CI failures fixed — inherited from #825's rebase (Ruff lint + cache test).

All CI checks passing. Merge order: #825 → #827 → this.

Lightheartdevs mentioned this pull request Apr 6, 2026

feat(extensions): install progress tracking with host agent orchestration #827

Open

7 tasks

Lightheartdevs requested changes Apr 6, 2026

View reviewed changes

yasinBursali and others added 5 commits April 6, 2026 20:25

fix: add user_extensions.py to Dockerfile COPY line

e6ee598

The file was added in the health-based status PR but missing from the Dockerfile's explicit COPY list, causing ModuleNotFoundError at runtime inside the container. Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

yasinBursali force-pushed the feat/extension-progress-ui branch from 133990d to cef5a10 Compare April 6, 2026 17:32

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

feat(extensions): progress UI + error display during install#828

feat(extensions): progress UI + error display during install#828
yasinBursali wants to merge 5 commits intoLight-Heart-Labs:mainfrom
yasinBursali:feat/extension-progress-ui

yasinBursali commented Apr 6, 2026

Uh oh!

Lightheartdevs left a comment

Uh oh!

yasinBursali commented Apr 6, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Conversation

yasinBursali commented Apr 6, 2026

What

Why

How

Security

Test Coverage

Three Pillars Impact

Files Changed

Platform Impact

Sequence

Uh oh!

Lightheartdevs left a comment

Choose a reason for hiding this comment

Uh oh!

yasinBursali commented Apr 6, 2026

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants